<template>
    <p>子组件{{ n }}</p>
</template>

<script>
export default {
    data() {
        return {
            n: 10,
        };
    },
    beforeCreate() {
        console.log("子组件 beforeCreate");
    },
    created() {
        setTimeout(() => {
            this.n = 20;
        }, 2000);
        console.log("子组件 created");
    },
    beforeUpdate() {
        console.log("子组件 beforeUpdate");
    },
    updated() {
        console.log("子组件 updated");
    },
    beforeDestroy() {
        console.log("子组件 beforeDestroy");
    },
    destroyed() {
        console.log("子组件 destroyed");
    },
};
</script>
